<%--
--%>

<%@page contentType="text/html" pageEncoding="UTF-8" %>

<%@taglib prefix="f" uri="http://java.sun.com/jsf/core" %>
<%@taglib prefix="h" uri="http://java.sun.com/jsf/html" %>
<%@taglib prefix="a4j" uri="http://richfaces.org/a4j" %>
<%@taglib prefix="rich" uri="http://richfaces.org/rich" %>

<f:subview id="oes">

    <f:verbatim>
        <script type="text/javascript" src="resources/js/prototype.js"></script>
        <script type="text/javascript" src="resources/js/shortcut.js"></script>

        <script type="text/javascript">
//            shortcut.add("Insert", function()
//            {
//                alert('insert caught');
//            },{
//                'target' : $('modalOes')
//            });
//
//            shortcut.add("Delete", function()
//            {
//                alert('delete caught');
//            },{
//                'target' : $('modalOes')
//            });
//
//            shortcut.add("Esc", function()
//            {
//                alert('esc caught');
//            },{
//                'target' : $('modalOes')
//            });
//
//            shortcut.add("Home", function()
//            {
//                alert('home caught');
//            },{
//                'target' : $('modalOes')
//            });
//
            function showOesModalPanel(goodCode, admin)
            {
                updateOesList(goodCode);

                $('oes:btnDeleteSelectedOes').style.display = (admin == 0 ? 'none' : '');
                $('oes:oesActions').style.display = (admin == 0 ? 'none' : '');

                setTimeout(function()
                {
                    Richfaces.showModalPanel('modalOes');
                }, 200);

            }

            function hideOesModalPanel()
            {
                Richfaces.hideModalPanel('modalOes');
            }
        </script>
    </f:verbatim>

    <a4j:form prependId="false" id="oesjs">
        <a4j:jsFunction name="insertOe" ajaxSingle="true" action="#{OesBean.insert}" reRender="oesList">
            <a4j:actionparam name="oe" assignTo="#{OesBean.input}"/>
        </a4j:jsFunction>
        <a4j:jsFunction name="updateOesList" ajaxSingle="true" reRender="oesList">
            <a4j:actionparam name="goodCode" assignTo="#{OesBean.goodCode}"/>
        </a4j:jsFunction>
    </a4j:form>

    <rich:modalPanel id="modalOes" autosized="true" width="600">
        <f:facet name="header">
            <h:outputText value="Работа с оригинальными номерами"/>
        </f:facet>
        <f:facet name="controls">
            <h:graphicImage value="/resources/img/close.png" onclick="hideOesModalPanel();"/>
        </f:facet>
        <h:panelGrid columns="2" cellspacing="5" cellpadding="5" columnClasses="dleft,dright">

            <%-- Список оригинальных номеров и кнопка удалить --%>
            <h:panelGroup id="oesList">
                <h:form prependId="false" id="fOesList">
                    <h:selectManyListbox value="#{OesBean.selectedOes}" style="height:400px;width:300px">
                        <f:selectItems value="#{OesBean.oes}"/>
                    </h:selectManyListbox><br>
                    <a4j:commandButton id="btnDeleteSelectedOes" value="Удалить выбранные" action="#{OesBean.delete}" reRender="oesList"/>
                </h:form>
            </h:panelGroup>

            <%-- Поиск оригинальных номеров и кнопка добавить --%>
            <h:panelGroup id="oesActions">
                <h:inputText id="tbOeInput" value="#{OesBean.input}" style="width:300px"/>
                <h:commandButton value="Добавить" onclick="insertOe($('oes:tbOeInput').value);" style="width:100px"/>
            </h:panelGroup>

        </h:panelGrid>
    </rich:modalPanel>

</f:subview>
